<template>
  <div>
    <!-- 顶部 -->
    <nav><topNav></topNav></nav>
    <!-- 吸顶头部 -->
    <haederSticky></haederSticky>
    <!-- 头部 -->
    <headers></headers>
    <!-- 内容容器 -->
    <div class="container">
      <router-view></router-view>
    </div>
    <!-- 底部 -->
    <footer><footers></footers></footer>
  </div>
</template>

<script>
import topNav from '@/components/app-topnav.vue'
import headers from '@/components/app-header.vue'
import footers from '@/components/app-footer.vue'
import haederSticky from '@/components/app-header-sticky.vue'
import { useStore } from 'vuex'
export default {
  components: {
    topNav,
    headers,
    footers,
    haederSticky
  },
  setup() {
    const store = useStore() // 获取头部的导航的分类
    store.dispatch('category/getCategory')
  }
}
</script>

<style lang="less" scoped></style>
